<template>
	<LoadingDemo />
	<FormInput />
	<!--<BaseButton :block="false" text="setAllBetList" @click="casinoStore.setAllBetList({ ...casinoStore.allBetList[0], orderId: Date.now() })" />-->
	<base-icon name="settings" size="20" class="app-text-link" @click="appStore.showSetting(true)" />
	<base-icon name="home" color="red" />
	<n-card title="卡片">卡片内容</n-card>
	<base-number-animation :to="100" />
	<div class="h-4"></div>
	<base-button type="primary" @click="onMessage">useMessage</base-button>
	<div class="h-4"></div>
	<base-button type="primary" @click="onDialog">useDialog</base-button>
	<div class="h-4"></div>
	<BaseButton type="primary" text="initSocket" @click="initSocket" />
	<n-date-picker v-model:value="date" type="daterange" clearable />
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { NCard, NDatePicker } from 'naive-ui'
import { BaseButton, BaseIcon, BaseNumberAnimation } from '@/components/base'
import { useDialog, useMessage } from '@/hooks'
import { useAppStore } from '@/store'
import { initSocket } from '@/utils'
import FormInput from './form-input.vue'
import LoadingDemo from './loading-demo.vue'

const message = useMessage()
const dialog = useDialog()
const appStore = useAppStore()
const date = ref(Date.now())

const onMessage = () => {
	message.success('测试成功', { closable: true })
}
const onDialog = () => {
	dialog.success({ title: '测试成功' })
}
</script>

<style lang="scss" scoped></style>
